﻿<!DOCTYPE html>
<html lang="en">
	<head>
		<title>Molgav</title>
		<meta charset="utf-8">
		<meta name="viewport" content="initial-scale=1.0, width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0" />
		<script src="WebAudioFontPlayer.js"></script>
		<script src="0300_LesPaul_sf2_file.js"></script>
		<script src="0280_LesPaul_sf2_file.js"></script>
		<script src="0250_Chaos_sf2_file.js"></script>
		<script src="0170_SBLive_sf2.js"></script>
		<!--<script src="0170_JCLive_sf2_file.js"></script>-->
		<script src="0001_FluidR3_GM_sf2_file.js"></script>
		<script src="0340_Aspirin_sf2_file.js"></script>
		<script src="0390_GeneralUserGS_sf2_file.js"></script>
		<script src="0490_Chaos_sf2_file.js"></script>
		<script src="12835_0_Chaos_sf2_file.js"></script>
		<script src="12838_22_FluidR3_GM_sf2_file.js"></script>
		<script src="12841_26_JCLive_sf2_file.js"></script>
		<script src="12842_26_JCLive_sf2_file.js"></script>
		<script src="12845_26_JCLive_sf2_file.js"></script>
		<script src="12846_26_JCLive_sf2_file.js"></script>
		<script src="12849_26_JCLive_sf2_file.js"></script>
		<script src="12851_26_JCLive_sf2_file.js"></script>
		<script src="localstore.js"></script>
		<script src="set.js"></script>
		<script src="RiffShareFlat.js"></script>
		<script>
			console.log('RiffShare flat v1.03');
		</script>
		<style>
			html, body {
				font-family: 'Gidugu', serif;
				background-color:#f00; 
				padding:0px; 
				margin:0px;
				width:100%; 
				height:100%;
			}
			a {
				color: #666;
				text-decoration: none;
			}
			.undob {
				position:absolute;
				top:0px;
				right:0px;
				width:10px;
				height:10px;
				margin-left:5px;
				margin-top:5px;
				margin-right:5px;
				margin-bottom:0px;
			}
			.redob {
				position:absolute;
				top:10px;
				right:0px;
				width:10px;
				height:10px;
				margin-left:5px;
				margin-top:0px;
				margin-right:5px;
				margin-bottom:5px;
			}
			.menub {
				position:absolute;
				top:20px;
				right:0px;
				width:10px;
				height:10px;
				margin-left:5px;
				margin-top:5px;
				margin-right:5px;
				margin-bottom:5px;
			}
			@font-face {
			  font-family: 'Yesteryear';
			  font-style: normal;
			  font-weight: 400;
			  src: local('Yesteryear'), local('Yesteryear-Regular'), url(yesteryer.woff2) format('woff2');
			  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
			}
			@font-face {
			  font-family: 'Gidugu';
			  font-style: normal;
			  font-weight: 400;
			  src: local('Gidugu'), url(gidugu.woff2) format('woff2');
			  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
			}
			.mainmenu {
				height: 100%;
				width: 0;
				position: fixed;
				z-index: 1;
				top: 0;
				right: 0;
				background-color: #eef;
				overflow-x2: hidden;
				overflow-y2: auto;
				overflow: hidden;
				transition: 0.5s;
				margin: 0px;
				padding:0px;
				box-shadow: 0px 0px 0.3cm grey;
				font-size: 0.75cm;
			}
			.menucontent {
				margin: 0px;
				padding:0px;
				border-left-style1: solid;
				border-left-color1: #abc;
				border-left-width1: 1px;
			}
			.menuheader {
				border-bottom-style: solid;
				border-bottom-width: 1px;
				border-bottom-color:#abc;
				overflow: hidden;
				white-space: nowrap;
				text-overflow: ellipsis;
				text-shadow2: 0 2px white;
				font-size2: 1.5rem;
				font-weight2: bold;
				color2: #999999;
				display2: flex;
				justify-content2: center;
				align-items2: center;
			}
			.menuelements {
				margin-left: 0.2cm;
				margin-right: 0.2cm;
				padding:0px;
				overflow-x: hidden;
				overflow-y: auto;
				position: fixed;
				z-index: 2;
				height: 100%;
				width: 6.8cm;
			}
			.buttonicon {
				height: 1cm;
				width:1cm;
				vertical-align: middle;
			}
			.menubutton {
				margin: 0;
				padding-top:0.1cm;
				border-bottom-style: solid;
				border-bottom-width: 1px;
				border-bottom-color:#abc;
				overflow: hidden;
				white-space: nowrap;
				text-overflow: ellipsis;

			}
			.menubuttonHead {
				margin: 0;
				padding-top:0.1cm;
			}
			.menubuttonRow {
				margin: 0;
				padding-top:0.1cm;
				font-size: 75%;
				text-overflow: ellipsis;
				overflow: hidden;
				white-space: nowrap;
			}
			.menubuttonFoot {
				margin: 0;
				padding-top:0.1cm;
				border-bottom-style: solid;
				border-bottom-width: 1px;
				border-bottom-color:#abc;
				font-size: 75%;
			}
		</style>
	</head>
	<body>
		<div id="rakeDiv" style="width:100%; height:100%;  background-color:#0f0; overflow:hidden; padding:0px; margin:0px;" >
			<div id="contentDiv" style="width:100%; height:100%; background-color:#000; padding:0px; margin:0px;" >
				<svg id="contentSVG" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" style="padding:0px; margin:0px;">
					<!--<g id='bgGroup'>
						<image id='bgImage' href="bg3.jpg" x="0px" y="0px" width="1280px" height="800px"/>
					</g>-->
					<g id='contentGroup'>
						<g id='counterGroup' ></g>
						<g id='paneGroup' ></g>
						<g id='linesGroup' ></g>
						<g id='textGroup' ></g>
						<g id='drumGroup' ></g>
						<g id='track1Group' ></g>
						<g id='track2Group' ></g>
						<g id='track3Group' ></g>
						<g id='track4Group' ></g>
						<g id='track5Group' ></g>
						<g id='track6Group' ></g>
						<g id='track7Group' ></g>
						<g id='track8Group' ></g>
						<g id='upperGroup' ></g>
					</g>
				</svg>
			</div>
		</div>
		
		<div id="undobutton" class="undob" onclick='riffshareflat.undoLast();'><img id="undoimg" src='undo.png' width='100%' height='100%' /></div>
		<div id="redobutton" class="redob" onclick='riffshareflat.redoNext();'><img id="redoimg" src='redo.png' width='100%' height='100%' /></div>
		<!--<div id='menubutton' class='menub' onclick='riffshareflat.openMenu();'><img id='menuimg' src='setting.png' width='100%' height='100%' /></div>-->
		<div id='menuDiv1' class='mainmenu'>
			<div class='menucontent1' id='subDivMenu'>
				<div class='menuheader'>
					<a href='javascript:void(0)' id='closeMenuB1' onclick='riffshareflat.closeMenuIns();'><img class='buttonicon' src='right.png' /><span id='menuTitle1'>Instrument</span></a>
				</div>
				<div class='menuelements' id='menuitems1'>
					<div id='channel1' class='menubuttonRow'>1gnsgndrgb nrsn </div>
					<div id='channel2' class='menubuttonRow'>2stgn drmnj dy</div>
					<div id='channel3' class='menubuttonRow'>3dsrtyj dym</div>
					<div id='channel4' class='menubuttonRow'>4dymnj drymg </div>
					<div id='channel5' class='menubuttonRow'>5xd jdrgfmn </div>
					<div id='channel6' class='menubuttonRow'>6xdrftgnj drtgfn </div>
					<div id='channel7' class='menubuttonRow'>7xsdtgn dfgn</div>
					<div id='channel8' class='menubuttonRow'>8xftgj xtygn </div>
					<div id='allVolumes' class='menubuttonRow'>Drums</div>					
					<div id='feelLabel' class='menubuttonRow'>feel</div>
					<div id='tpnLabel' class='menubuttonRow'>tpn</div>
					<div id='breaksLabel' class='menubuttonRow'>tpn</div>
					<div id='clearSongB' class='menubuttonRow'>Clear song</div>
					<div id='importSongB' class='menubuttonRow'>Merge MusicXML</div>
					<div id='panelsMode' class='menubuttonRow'>Panels</div>
				</div>
			</div>
		</div>
		<div id='menuDiv2' class='mainmenu'>
			<div class='menucontent2' id='subDivMenu'>
				<div class='menuheader'>
					<a href='javascript:void(0)' id='closeMenuB2' onclick='riffshareflat.closeMenuDrum();'><img class='buttonicon' src='right.png' /><span id='menuTitle2'>Drum</span></a>
				</div>
				<div class='menuelements' id='menuitems2'>
					<div class='menubuttonRow'>&nbsp;</div>
				</div>
			</div>
		</div>
	</body>
</html>
